<template>
	<view>
		<u-card :title="title" @body-click="enterDetail" :sub-title="subTitle">
			<view class="" slot="body">
				<view class="u-body-item u-flex u-border-bottom u-col-between u-p-t-0">
					<image :src="imgUrl" mode="aspectFill"></image>
					<view class="u-body-item-title u-line-2">{{detail}}</view>
				</view>
			</view>
			<view class="" slot="foot">
				<div class="option" @click="show=!show">删除</div>
			</view>
		</u-card>
		<view>
			<u-modal v-model="show" content="是否删除该设备？" :show-cancel-button="true" @confirm="deleteCard"></u-modal>
		</view>
		<u-toast ref="uToast" />
	</view>

</template>

<script>
	export default {
		props: ["title", "detail"],
		data() {
			return {
				subTitle: '2020-05-15',
				thumb: 'http://pic2.sc.chinaz.com/Files/pic/pic9/202002/hpic2119_s.jpg',
				//https://img11.360buyimg.com/n7/jfs/t1/94448/29/2734/524808/5dd4cc16E990dfb6b/59c256f85a8c3757.jpg
				imgUrl: "/static/logo.png",
				show: false
			};
		},
		methods: {
			//进入设备详情
			enterDetail() {
				console.log("进入" + this.title)
						
				
				let vc = this

				//将信息存入
				uni.setStorage({
					key: 'deviceId',
					data: this.title,
					success: function() {
						console.log('sava deviceId:', vc.title);
					}
				});


				uni.navigateTo({
					url: `/pages/index/index?title=${this.title}`,
				});
				
			},
			//删除卡片
			deleteCard() {
				console.log("deleteCard")

				//发送请求,删除设备

				this.$emit('delete');
				this.$refs.uToast.show({
					title: '删除成功',
					type: 'success',
					// url: '/pages/login/login'
				})

				// this.$refs.uToast.show({
				// 	title: '删除失败',
				// 	type: 'error',
				// 	// url: '/pages/login/login'
				// })

			},

		}
	};
</script>

<style scoped lang="scss">
	.u-card-wrap {
		background-color: $u-bg-color;
		padding: 1px;
	}

	.u-body-item {
		font-size: 32rpx;
		color: #333;

	}

	.u-body-item image {
		width: 120rpx;
		flex: 0 0 120rpx;
		height: 120rpx;
		border-radius: 8rpx;
	}

	.u-body-item-title {
		margin-left: 15rpx;
	}

	.option {
		margin-left: 550rpx;
	}
</style>